<!--
@description: 工单详情页
@creationTime: 2025-04-17
-->

<route type="page" lang="json5">
{
  layout: 'default',
  style: {
    navigationBarTitleText: '工单详情'
  }
}
</route>

<template>
  <view class="h-100vh pb-8vh box-border! overflow-auto">
    <view class="px-2 space-y-1">
      <Segmented v-model="activeTab" :options="tabs" @change="handleChange"></Segmented>
    </view>
    <view class="p-2 space-y-1">
      <wd-notice-bar
        text="李工：勘察阶段，带好工具，每日报工不要忘记了！"
        prefix="check-outline"
        type="info"
        custom-class="space"
      />
    </view>
    <template v-if="activeTab === '预勘察'">
      <Warn :warnList="warnList"></Warn>
      <WarnMessage></WarnMessage>
      <FormMenu></FormMenu>
      <UnderButton text="开始勘察" @click="submit"></UnderButton>
    </template>
    <template v-if="activeTab === '勘察中'">
      <FormMenu2></FormMenu2>
      <UnderButton text="勘察结束" @click="submit1"></UnderButton>
    </template>
    <template v-if="activeTab === '勘察整改'">
      <WarnMessage></WarnMessage>
      <FormMenu3></FormMenu3>
      <UnderButton text="整改完成" @click="submit2"></UnderButton>
    </template>
    <template v-if="activeTab === '勘察完成'">
      <WarnMessage></WarnMessage>
      <FormMenu2></FormMenu2>
    </template>

    <Feature></Feature>
  </view>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import Segmented from './components/Segmented.vue'
import Warn from './components/Warn.vue'
import FormMenu from './modules/FormMenu.vue'
import UnderButton from './components/UnderButton.vue'
import WarnMessage from './components/WarnMessage.vue'
import Feature from './components/Feature.vue'
import FormMenu2 from './modules/FormMenu2.vue'
import FormMenu3 from './modules/FormMenu3.vue'
const activeTab = ref<number | string>('预勘察')

const tabs = ref([
  { value: '预勘察', disabled: false },
  { value: '勘察中', disabled: true },
  { value: '勘察整改', disabled: true },
  { value: '勘察完成', disabled: true }
])
const warnList = ref(['两人及以上去现场勘察', '至少1人有低压电工作业证', '勘察所使用的工具', '勘察的差旅费用'])
onMounted(() => {
  const savedData = uni.getStorageSync('tabs')
  if (savedData) {
    tabs.value = savedData._value
    let disabled = tabs.value.filter(v => !v.disabled)
    activeTab.value = disabled[disabled.length - 1]?.value
  }
})

const submit = () => {
  tabs.value[1].disabled = false
  activeTab.value = '勘察中'
  uni.setStorageSync('tabs', tabs)
}
const submit2 = () => {
  tabs.value[3].disabled = false
  activeTab.value = '勘察完成'
  uni.setStorageSync('tabs', tabs)
}
const submit1 = () => {
  const savedData = uni.getStorageSync('formDataKC')
  let list = []
  Object.keys(savedData._value).forEach(v => {
    if (Array.isArray(savedData._value[v])) {
      let data = savedData._value[v].some(val => {
        return val.isAnomaly === true
      })
      if (data) {
        list.push(savedData._value[v])
      }
    }
  })
  if (list.length > 0) {
    tabs.value[2].disabled = false
    activeTab.value = '勘察整改'
    uni.setStorageSync('tabs', tabs)
  }
}
const handleChange = e => {
  console.log(e)
}
</script>

<style lang="scss" scoped></style>
